<!DOCTYPE html>
<html>

<head>
	<meta charset="utf-8">
	<title>商品编辑</title>
	<meta name="renderer" content="webkit">
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
	<meta name="apple-mobile-web-app-status-bar-style" content="black">
	<meta name="apple-mobile-web-app-capable" content="yes">
	<meta name="format-detection" content="telephone=no">
	<link href="/node_modules/LobsterUIFrame/layuiadmin/layui/css/layui.css" rel="stylesheet" />
	<link href="/node_modules/LobsterUIFrame/layuiadmin/style/admin.css" rel="stylesheet" />
	<link href="/node_modules/LobsterUIFrame/layuiadmin/layui/css/modules/layui-icon-extend/iconfont.css"
		rel="stylesheet" />
	<script src="/node_modules/LobsterUIFrame/layuiadmin/layui/layui.js"></script>

	<link rel="stylesheet" type="text/css"
		href="https://img.ppp.yt/formSelects-v4.css" />

	<script src="https://img.ppp.yt/formSelects-v4.min.js"
		type="text/javascript" charset="utf-8"></script>

</head>

<body>
	<div class="layui-fluid box">
		<form class="layui-form" lay-filter="formdata" id="formdata" name="formdata">
			<div class="layui-card">
				<div class="layui-card-body">

					<div class="layui-row">
						<div class="layui-col-xs12">
							<div class="layui-form-item">
								<label class="layui-form-label"><i style="color:red;">*&ensp; </i>商品名称</label>
								<div class="layui-input-block">
									<input type="text" class="layui-input" lay-verify="required" id="GoodsName"
										name="GoodsName" disabled />
								</div>
							</div>
						</div>
					</div>

					<div class="layui-row">
						<div class="layui-col-xs12">
							<div class="layui-form-item">
								<label class="layui-form-label">商品规格</label>
								<div class="layui-input-block" id="GoodsSpecs">

								</div>
							</div>
						</div>
					</div>

					<div id="tempadd">

					</div>

					<div class="layui-row">
						<div class="layui-col-xs12">
							<div class="layui-form-item">
								<label class="layui-form-label">商品库存</label>
								<div class="layui-input-block">
									<input type="text" class="layui-input" id="GoodsStock" name="GoodsStock" />
								</div>
							</div>
						</div>
					</div>



					<div class="layui-row">
						<div class="layui-col-xs12">
							<div class="layui-form-item">
								<label class="layui-form-label">市场价格</label>
								<div class="layui-input-block">
									<input type="text" class="layui-input" id="GoodsMarketPrice"
										name="GoodsMarketPrice" />
								</div>
							</div>
						</div>
					</div>

					<div class="layui-row">
						<div class="layui-col-xs12">
							<div class="layui-form-item">
								<label class="layui-form-label">零售价格</label>
								<div class="layui-input-block">
									<input type="text" class="layui-input" id="GoodsRetailPrice"
										name="GoodsRetailPrice" />
								</div>
							</div>
						</div>
					</div>

					<div class="layui-form-item layui-hide">
						<input type="button" lay-submit lay-filter="btnSubmit" id="btnSubmit" value="确认">
					</div>
				</div>
			</div>
			<div class="layui-form-item layui-hide">
				<input type="button" lay-submit lay-filter="LAY-app-front-submit" id="LAY-app-front-submit" value="保存">
				<input type="button" lay-cancel lay-filter="LAY-app-front-cancel" id="LAY-app-front-cancel" value="取消">
				<input type="reset" id="LAY-app-form-reset" value="重置">
			</div>

			<div class="layui-form-item layui-hide">
				<input type="text" id="GoodsId" name="GoodsId" value="0" />
				<input type="text" id="GoodsSpecImg" name="GoodsSpecImg" value="0" />
				<input type="text" id="SpecItemId" name="SpecItemId" value="0" />
				<input type="text" id="allspedid" name="allspedid" value="" />
			</div>
		</form>
	</div>
	<script id="GoodsSpecsTemp" type="text/html">
		{{#  layui.each(d, function(index, item){ }}
		<input type="checkbox" name="spec[{{item.SpecId}}]" lay-skin="primary" title="{{item.SpecName}}" checked="" disabled="">
		{{#  }); }}
	</script>
	<script id="temp1" type="text/html">
		{{#  layui.each(d, function(index, item){ }}
		<div class="layui-row">
			<div class="layui-col-xs12">
				<div class="layui-form-item">
					<label class="layui-form-label">{{item.SpecName}}</label>
					<div class="layui-input-block">
						<select name="SpecIdSelect-{{item.SpecId}}" lay-verify="required" multiple lay-tools lay-filter="{{item.SpecId}}" xm-select="{{item.SpecId}}" xm-select-type="1">
							{{#  layui.each(item.specs, function(index1, item1){ }}
							<option value="{{item1.SpecItemId}}">{{item1.SpecItemName}}</option>
							{{#  }); }}
						</select>
					</div>
				</div>
			</div>
		</div>
		{{#  }); }}
	</script>
</body>

</html>
<script>
	layui.config({
		base: '/node_modules/LobsterUIFrame/layuiadmin/' //静态资源所在路径
	}).extend({
		index: 'lib/index' //主入口模块
	});

	layui.define(['index', 'layer', 'form', 'element', 'table', 'upload', 'laytpl','formSelects'], function () {
		var layer = layui.layer;
		var form = layui.form;
		var element = layui.element;
		var table = layui.table;
		var $ = layui.$;
		var admin = layui.admin;
		var setter = layui.setter;
		var upload = layui.upload;
		var laytpl = layui.laytpl;		
        var formSelects = layui.formSelects;


		var controller = {
			data: {
				model: {},
				fun: null,
				mainsrc: '',
				piclist: [],
				specdic: null,
				goodsSpec: null,
			},
			//初始化页面
			initpage: function () {
				var self = this;
				console.log(parent.modelData)
				self.data.model = parent.modelData;
				self.getgoodsspec();
				self.getspecdic();
				self.initevent();
			},
			getgoodsspec: function () {
				var self = this;
				var url = self.getbaseurl("Mall.getgoodsSpec");
				admin.req({
					type: 'get',
					url: url,
					data: {
						Name: '',
						goodsid: self.data.model.GoodsId,
						page: 1,
						limit: 999
					},
					done: function (obj) {
						console.log(obj)
						self.data.goodsSpec = obj.data
						self.initData()
					}
				});
			},
			getbaseurl: function (fun) {
				var url = "/lowcode/APP20200616102057595/shop/?view=layui&fun=" + fun;
				return url;
			},
			getspecdic: function () {
				var self = this;
				var url = self.getbaseurl("Mall.getspecdic");
				admin.req({
					type: 'get',
					url: url,
					done: function (obj) {
						console.log(obj)
						self.data.specdic = obj.data
					}
				});
			},
			//初始化事件
			initevent: function () {
				var self = this;
				parent.getResult = function (fun) {
					self.data.fun = fun;
					$("#btnSubmit").click();
				}
				form.on('submit(btnSubmit)', function (data) {
					data.field.goodsSpec = self.data.goodsSpec
					console.log(data.field)
					self.data.fun(data.field);
				});


			},

			//加载数据
			initData: function () {
				var self = this;
				if (self.data.model) {

					console.log(self.data.model)
					form.val("formdata", Object.assign({}, self.data.model));
					console.log(self.data.goodsSpec)
					var distinctSpec = []
					var obj = {};
					for (let i = 0; i < self.data.goodsSpec.length; i++) {
						if (!obj[self.data.goodsSpec[i].SpecId]) {
							distinctSpec.push(self.data.goodsSpec[i]);
							obj[self.data.goodsSpec[i].SpecId] = true;
							$("#allspedid").val($("#allspedid").val()+','+self.data.goodsSpec[i].SpecId)
						}
					}
					if($("#allspedid").val()!=""){
						$("#allspedid").val($("#allspedid").val().substring(1))
					}
					console.log(distinctSpec)

					var getTpl = GoodsSpecsTemp.innerHTML
						, view = document.getElementById('GoodsSpecs');
					laytpl(getTpl).render(distinctSpec, function (html) {
						console.log(html)
						view.innerHTML = html;
						form.render();
					});

					for (let i = 0; i < distinctSpec.length; i++) {
						distinctSpec[i].specs = []
						for (let j = 0; j < self.data.goodsSpec.length; j++) {
							var element =JSON.parse( JSON.stringify( self.data.goodsSpec[j]))
							if (distinctSpec[i].SpecId == element.SpecId) {
								distinctSpec[i].specs.push(element)
							}
						}
					}
					var getTpl1 = temp1.innerHTML
						, view1 = document.getElementById('tempadd');
					laytpl(getTpl1).render(distinctSpec, function (html) {
						console.log(html)
						view1.innerHTML = html;
						form.render();
						formSelects.render();
					});
				}
			},
		}

		/*
		* 入口
		*/
		controller.initpage();
	});

</script>
